import { createRouter, createWebHashHistory } from 'vue-router'
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
import { Session } from '@/utils/storage'
import { useRouteStore } from '@/stores/routeStore'
import { useThemeStore } from '@/stores/themeStore'
import { useKeepAliveStore } from '@/stores/keepAliveStore'

import { staticRoutes, notFoundAndNoPower, dynamicRoutes } from '@/router/route'
import { initFrontEndControlRoutes } from '@/router/frontEnd'
/**
 * 1、前端控制路由时：isRequestRoutes 为 false，需要些 roles，需要走 setFilterRoute 方法
 * 2、后端控制路由时：isRequestRoutes 为 true，不需要些roles，不需要走 setFilterRoute 方法
 *
 * 对应相关方法： `backEnd.ts` 与 `frontEnd.ts`
 *
 * 1、前端控制：路由菜单由前端去写（无菜单管理界面，有角色管理界面），角色管理中 有roles 树形，需要返回userInfo
 * 2、后端控制：路由菜单由后端返回（有菜单管理界面，有角色管理界面）
 *
 */

export const router = createRouter({
    history: createWebHashHistory(),
    /**
     * 1、notFoundAndNoPower 默认添加 404、401 界面，防止一直提示 No match found for location with path 'xxx'
     * 2、backEnd.ts(后端控制路由)、frontEnd.ts(前端控制路由) 中也需要加 notFoundAndNoPower 404、401 界面。
     *    防止 404、401 不在 layout 布局中，不设置的话，404、401 界面将全屏显示
     */
    routes: [...notFoundAndNoPower, ...staticRoutes, ...dynamicRoutes],
})

/**
 * 路由多级嵌套数组处理成一维数组
 * @param arr 传入路由菜单数据数组
 * @returns 返回处理后的一维路由菜单数组
 */
export function formatFlatteningRoutes(arr: any) {
    if (arr.length <= 0) return false
    for (let i = 0; i < arr.length; i++) {
        if (arr[i].children) {
            arr = arr.slice(0, i + 1).concat(arr[i].children, arr.slice(i + 1))
        }
    }
    return arr
}

/**
 * 一维数组处理成多级嵌套数组（只保留二级：也就是二级以上全部处理成只有二级，keep-alive 支持二级缓存）
 * @description isKeepAlive 处理 `name` 值，进行缓存。顶级关闭，全部不缓存
 * @param arr 处理后的一维路由菜单数组
 * @returns 返回将一维数组重新处理成 `定义动态路由（dynamicRoutes）` 的格式
 */
export function formatTwoStageRoutes(arr: any) {
    if (arr.length <= 0) return false
    const newArr: any = []
    const cacheList: Array<string> = []
    arr.forEach((v: any) => {
        if (v.path === '/') {
            newArr.push({
                component: v.component,
                name: v.name,
                path: v.path,
                redirect: v.redirect,
                meta: v.meta,
                children: [],
            })
        } else {
            // 判断是否是动态路由（xx/:id/:name），用于 tagsView 等中使用
            if (v.path.indexOf('/:') > -1) {
                v.meta['isDynamic'] = true
                v.meta['isDynamicPath'] = v.path
            }
            newArr[0].children.push({ ...v })
            // 存 name 值，keep-alive 中 include 使用，实现路由的缓存
            // 路径：/@/layout/routerView/parent.vue
            if (newArr[0].meta.isKeepAlive && v.meta.isKeepAlive) {
                cacheList.push(v.name)
                const keepAliveStore = useKeepAliveStore()
                keepAliveStore.setCacheKeepAlive(cacheList)
            }
        }
    })
    return newArr
}

router.beforeEach(async (to, from, next) => {
    NProgress.configure({ showSpinner: false })
    if (to.meta.title) NProgress.start()
    const token = Session.get('token')
    if (to.path === '/login' && !token) {
        next()
        NProgress.done()
    } else {
        if (!token) {
            next(
                `/login?redirect=${to.path}&params=${JSON.stringify(to.query ? to.query : to.params)}`,
            )
            Session.clear()
            NProgress.done()
        } else if (token && to.path === '/login') {
            next('/home')
            NProgress.done()
        } else {
            const routeStore = useRouteStore()
            const { routesList } = routeStore
            if (routesList.length === 0) {
                // 后端控制权限
                const themeStore = useThemeStore()
                const { isRequestRoutes } = themeStore.themeConfig
                if (isRequestRoutes) {
                    next()
                } else {
                    // 前端控制路由
                    await initFrontEndControlRoutes()
                    next({ path: to.path, query: to.query })
                }
            } else {
                next()
            }
        }
    }
    // next()
})

// 路由加载后
router.afterEach(() => {
    NProgress.done()
})

// 导出路由
export default router
